<template>
	<view class="container">
		<view class="header">
			<view class="arrow" @tap="$back()"><image src="../../../static/images/arrow_left.png" mode="aspectFit"></image></view>
			<view class="tit f36 cfff">个人信息</view>
			<view class="btn f32 cfff" @click="go()">保存</view>
		</view>

		<view class="personBox">
			<view class="item" @click="addMa">
				<view class="left">
					<view class="pic"><image :src="ImageMall" mode="aspectFit"></image></view>
				</view>
				<view class="right">
					<view class="text f30 c666">修改头像</view>
					
				</view>
			</view>
			<view class="item">
				<view class="left"><view class="text f30 c333">昵称</view></view>
				<view class="right" ></view><input type="text" value="" :placeholder="name" v-model="name" /></view>
			</view>
		</view>
	</view>
</template>

<script>
import {baseUrl} from '../../../common/config.js'
export default {
	data() {
		return {
			arry:{},
			name:'',
			ImageMall:''
		};
	},
	onLoad(e) {
		
		this.arry=JSON.parse(e.id)
		console.log(this.arry)
		this.name=this.arry.name
		this.ImageMall=this.arry.avatar
	},
	methods: {
		addMa() {
		    var that = this;
		    uni.chooseImage({
		     count: 1, //默认9
		     sizeType: ['compressed'],
		     success: function(res) {
		      uni.showLoading({
		       title: '全力上传中'
		      });
		      uni.uploadFile({
		       url:baseUrl + 'api/v1.user/avatar',
		       filePath: res.tempFilePaths[0],
		       name: 'file',
			   formData: {
			                act:'direct',
			             },
		       header: {
		        token: uni.getStorageSync('userinfo').token
		       },
		       success: uploadFileRes => {
		        uni.hideLoading();
				
		        uni.showToast({
		         title: '上传成功',
		         icon: 'none'
		        });
		
		    that.ImageMall = JSON.parse(uploadFileRes.data).result.result;
		

		       },
		       fail: err => {
		        console.log(err);
		       }
		      });
		     }
		    });
		
			},
			go(){
				this.$ajax('api/v1.user/edit',{
				    user_id:this.arry.user_id,
					name:this.name
				       }).then((res)=>{
				      // console.log(res);
					  uni.navigateTo({
					  	url:'../../my/setting'
					  })
				       }).catch(res=>{
				        console.log(Error);
				       })
			}
	}
};
</script>

<style lang="scss">
page {
	background-color: #f7f4f8;
}
.header {
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	background-color: #249af6;
	padding: 50upx 30upx 20upx 30upx;
	.arrow {
		image {
			width: 20upx;
			height: 40upx;
		}
	}
}
.personBox {
	background-color: $white-background;
	.item {
		display: flex;
		flex-direction: row;
		align-items: center;
		justify-content: space-between;
		padding: 30upx 40upx;
		border-bottom: 1upx #eee solid;
		.left {
			.pic {
				image {
					width: 90upx;
					height: 90upx;
					border-radius: 50%;
				}
			}
		}
		.right {
			display: flex;
			flex-direction: row;
			align-items: center;
			.arrow {
				image {
					width: 20upx;
					height: 35upx;
					vertical-align: middle;
					margin-left: 25upx;
					margin-bottom: 6upx;
				}
			}
		}
	}
}
</style>
